@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&family=Ubuntu:wght@400;500;700&display=swap');

/*changes to the whole body*/
*{
	margin: 0;
	padding: 0;
	box-sizing: border-box; /*padding and border are included in the width and height of an elemented*/
	text-decoration: none;
}




/*changes to the scroll behavior*/
html{
	scroll-behavior: smooth;
}




/*setting the max-width of the page*/
.max-width{
	max-width: 1910;
	padding: 0px 60px;
	margin:auto;
}




/*changes to the top navigation*/
.navbar{
	position: absolute;
	width: 100%;
	padding: 5px 0px;
	background: #f2f2f2;
	font-family: "Poppins";
}

.navbar .max-width{
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.navbar .logo a{
	color: black;
	font-size: 15px;
	font-weight: 400;
}

.navbar .menu li{
	list-style: none;
	display: inline-block;
}

.navbar .menu li a{
	color:black;
	font-size: 15px;
	font-weight: 100;
	margin-left: 15px;
}

.navbar .max-width .logo img{
	width: auto;
	height: 30px;
}

.navbar .logo a{
	width: auto;
	height: 50%;
}

h3{
	color:black;
	font-size: 15px;
	font-weight: 100;
	margin-left: 10px;
}

.navbar .logo a:hover{
	opacity: 0.5;
}

.navbar .menu li a:hover{
	opacity: 0.5;
}




/*changes to the middle navigation & the dropdown menu*/
.Number1{
	z-index: -1;
	position: absolute;
	top: 48px;
	left: 0;
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 0px 100px;
	font-family: "Poppins";
	background-color: white;
	transition: 0.6s;
}

.Number1 .navigation{
	position: relative;
	line-height: 75px;
}

.Number1 .navigation .menu{
	position: relative;
	display: flex;
	justify-content: center;
	list-style: none;
	user-select: none;
}

.menu-item > a{
	color:black;
	font-size: 18px;
	text-decoration: none;
	margin:20px;
	padding: 25px 0;
}

.menu-item > a:hover{
	text-decoration:underline 2px black;
    text-underline-offset: 25px;
	transition: 0.3s;
}

.menu-item .sub-menu,
.menu-item .sub-menu2,
.menu-item .sub-menu3,
.menu-item .sub-menu4,
.menu-item .sub-menu5,
.menu-item .sub-menu6{
	box-shadow: 0px 285px 1000px grey;
	position: absolute;
	background: white;
	left: -589px;
	top:77px;
	width: 262%;
	justify-content: center;
	line-height: 30px;
	list-style: none;
	pointer-events: none;
	transform: translateY(-10px);
	opacity: 0;
}

.menu-item:hover .sub-menu,
.menu-item:hover .sub-menu2,
.menu-item:hover .sub-menu3,
.menu-item:hover .sub-menu4,
.menu-item:hover .sub-menu5,
.menu-item:hover .sub-menu6{
	pointer-events: all;
	transform: translateY(0);
	opacity: 1;
	padding: 30px 0px;
	transition: 0.3s;
}

.menu-item .sub-menu .sub-item,
.menu-item .sub-menu2 .sub-item,
.menu-item .sub-menu3 .sub-item,
.menu-item .sub-menu4 .sub-item,
.menu-item .sub-menu5 .sub-item,
.menu-item .sub-menu6 .sub-item{
	position: relative;
	padding: 1.5px 0px;
	cursor: pointer;
}

.menu-item .sub-menu .sub-item a,
.menu-item .sub-menu2 .sub-item a,
.menu-item .sub-menu3 .sub-item a,
.menu-item .sub-menu4 .sub-item a,
.menu-item .sub-menu5 .sub-item a,
.menu-item .sub-menu6 .sub-item a{
	color: black;
	font-size: 14px;
	text-decoration: none;
	padding: 15px 30px;
	opacity: 0.5;
}

.menu-item .sub-menu .sub-item a:hover,
.menu-item .sub-menu2 .sub-item a:hover,
.menu-item .sub-menu3 .sub-item a:hover,
.menu-item .sub-menu4 .sub-item a:hover,
.menu-item .sub-menu5 .sub-item a:hover,
.menu-item .sub-menu6 .sub-item a:hover{
	opacity: 1;
	transition: 0.3s;
}

.menu-item .sub-menu .heading,
.menu-item .sub-menu2 .heading,
.menu-item .sub-menu3 .heading,
.menu-item .sub-menu4 .heading,
.menu-item .sub-menu5 .heading,
.menu-item .sub-menu6 .heading{
	position: relative;
	padding: 7px 0;
	cursor: pointer;
}

.menu-item .sub-menu .sub-heading a,
.menu-item .sub-menu2 .sub-heading a,
.menu-item .sub-menu3 .sub-heading a,
.menu-item .sub-menu4 .sub-heading a,
.menu-item .sub-menu5 .sub-heading a,
.menu-item .sub-menu6 .sub-heading a{
	color: black;
	font-size: 16px;
	text-decoration: none;
	padding: 15px 30px;
}

.sub-menu,
.sub-menu4,
.sub-menu5,
.sub-menu6{
display:grid;
grid-template-columns: repeat(5, max-content);
gap: 20px;
}

.sub-menu2,
.sub-menu3{
display:grid;
grid-template-columns: repeat(4, max-content);
gap: 20px;
}

.item{
display:flex;
flex-direction:column;
gap: 0px;
}

.logo2 img{
	position: absolute;
	width: auto;
	height: 25px;
	left: 60px;
	top: 70px;
}

.logo2 a{
	width: auto;
	height: 100%;
}

.logo2 a:hover{
	opacity: 0.5;
}

.shopping-bag img{
	position: absolute;
	width: auto;
	height: 30px;
	right: 60px;
	top: 70px;
}

.shopping-bag a{
	width: auto;
	height: 100%;
}

.shopping-bag a:hover{
	opacity: 0.5;
}

.heart-nofill img{
	position: absolute;
	width: auto;
	height: 30px;
	right: 100px;
	top: 70px;
}

.heart-nofill a{
	width: auto;
	height: 100%;
	opacity: 0.75;
}

.heart-nofill a:hover{
	opacity: 0.3;
}

.search-container{
	position: absolute;
	z-index: 5;
	height: 30px;
	right: 140px;
	top: 62px;
}

.search-nofill img{
	position: absolute;
	opacity: 0.75;
	z-index: 6;
	width: auto;
	height: 25px;
	right: 300px;
	top: 75px;
}

.search-nofill a{
	width: auto;
	height: 100%;
}

input[type=text] {
  padding: 8px 50px;
  width: 200px;
  height:50px;
  font-size: 15px;
  border: 2px solid #f2f2f2;
  background: #f2f2f2;
  border-radius: 18px;
  opacity: 0.5;
}

.search-container input[type=text]:hover {
  opacity: 0.75;
}




/*changes to the bottom navbar*/
.navbar3{
	position: absolute;
	width: 100%;
	padding: 20px 0px;
	background: #f2f2f2;
	font-family: "Poppins";
	margin-top: 125px;
	z-index: -2;
	border-bottom: 1px solid #e0e0e0;
}

.navbar3 .max-width{
	display: flex;
	align-items: center;
	justify-content: center;
}

.navbar3 .menu3 .arrowright .arrowleft{
	list-style: none;
	display: inline-block;
}

.navbar3 .menu3 h3{
	color:black;
	font-size: 15px;
	font-weight: 100;
	margin-left: 25px;
}

.navbar3 .menu3 a span{
	text-decoration: underline;
	color:black;
}

.navbar3 .max-width .arrowright img{
	width: auto;
	height: 20px;
}

.navbar3 .arrowright{
	width: auto;
	height: 100%;
	padding-left: 40px;
	padding-top: 8px;
	opacity: 0.3;
}

.navbar3 .arrowright:hover{
	opacity: 0.5;
}

.navbar3 .max-width .arrowleft img{
	width: auto;
	height: 20px;
}

.navbar3 .arrowleft{
	width: auto;
	height: 100%;
	padding-right: 20px;
	padding-top: 8px;
	opacity: 0.3;
}

.navbar3 .arrowleft:hover{
	opacity: 0.5;
}




/*changes to the text on top of the bottom navbar*/
.overflow{
	position: absolute;
	width: auto;
	padding: 5px 0px;
	background: white;
	font-family: "Poppins";
	top: 215px;
	left: 60px;
	z-index: -3;
}

.overflow .menu2 li{
	list-style: none;
	display: inline-block;
}

.overflow .menu2 li a{
	color:black;
	top: 210px;
	padding-left: 0px;
	font-size: 15px;
	font-weight: 100;
	left: 60px;
}

.overflow .menu2 li a:hover{
	opacity: 0.5;
}




/*changes to the most bottom and sticky navbar*/
.navbar4{
font-family: "Poppins";
z-index: -4;
position: absolute;
top: 230px;
background-color:white;
width:100%;
}

.navbar4 .title{
float:left;
color:black;
font-size:23px;
font-weight:350;
line-height:70px;
padding-left:60px;
}

.navbar4 .menu01{
float:right;
list-style:none;
margin-right:40px;
position:relative;
}

.navbar4 .menu01 li{
float:left;
display:inline-block;
background:white;
margin:0 5px;
}

.navbar4 .menu01 li a{
color:black;
text-decoration:none;
line-height:70px;
font-size:18px;
padding: 0px 15px;
}

.navbar4 .menu01 .sub-menu01{
border-radius: 20px;
position:absolute;
top:70px;
left:50px;
transform: translateY(-10px);
opacity: 0;
visibility: hidden;
list-style: none;
}

.navbar4 .menu01 li:hover > .sub-menu01{
	transform: translateY(0px);
	opacity: 1;
	transition: 0.3s;
	visibility: visible;
}

.navbar4 .menu01 .sub-menu01 li a{
	line-height: 40px;
	float: right;
	opacity: 1;
}

.navbar4 .menu01 .sub-menu01 li a:hover{
	opacity: 0.5;
}

.navbar4 .menu01 .sub-menu01 li{
position:relative;
width: 180px;
display:block;

}

.navbar4.sticky{
	position: fixed;
	top:0px;
}

.sticky .title{
	font-size: 21px;
}




/*changes to the left menu filter overflow:auto box*/
.menu4.sticky2{
	position: fixed;
	top:75px;
	left: 60px;
	width: 220px;
    height: 90%;
}

.menu4{
    width: 220px;
    height: 630px;
    overflow: auto;
    overflow-x: hidden;
    position: absolute;
	background: white;
	font-family: "Poppins";
	top: 310px;
	left: 60px;
	z-index: -5;
}

.menu-item4 > a{
	color:black;
	font-size: 16px;
	font-weight: 100;
	list-style: none;
	text-decoration: none;
	line-height: 30px;
}

.menu-item5{
	margin-top: 50px;
	padding-top: 10px;
	border-top: 1px solid #e0e0e0;
}

.menu-item6{
	margin-top: 100px;
	padding-top: 10px;
	border-top: 1px solid #e0e0e0;
}

.menu-item7{
	margin-top: 130px;
	padding-top: 10px;
	border-top: 1px solid #e0e0e0;
}

.menu-item8{
	margin-top: 100px;
	padding-top: 10px;
	border-top: 1px solid #e0e0e0;
}

.menu-item9{
	margin-top: 100px;
	padding-top: 10px;
	border-top: 1px solid #e0e0e0;
}

.menu-item10{
	margin-top: 130px;
	padding-top: 10px;
	border-top: 1px solid #e0e0e0;
}

.menu-item11{
	margin-top: 130px;
	padding-top: 10px;
	border-top: 1px solid #e0e0e0;
}

.menu-item12{
	margin-top: 80px;
	padding-top: 10px;
	border-top: 1px solid #e0e0e0;
}

.menu-item13{
	margin-top: 80px;
	padding-top: 10px;
	border-top: 1px solid #e0e0e0;
}

.menu-item14{
	margin-top: 100px;
	padding-top: 10px;
	border-top: 1px solid #e0e0e0;
}

.sub-menu5,
.sub-menu6,
.sub-menu7,
.sub-menu8,
.sub-menu9,
.sub-menu10,
.sub-menu11,
.sub-menu12,
.sub-menu13,
.sub-menu14{
	padding-top:15px;
}

.menu-item5 > a,
.menu-item6 > a,
.menu-item7 > a,
.menu-item8 > a,
.menu-item9 > a,
.menu-item10 > a,
.menu-item11 > a,
.menu-item12 > a,
.menu-item13 > a,
.menu-item14 > a{
	color:black;
	font-size: 16px;
	text-decoration: none;
	font-weight: 100;
	list-style: none;
}

.menu-item5 .sub-menu5,
.menu-item6 .sub-menu6,
.menu-item7 .sub-menu7,
.menu-item8 .sub-menu8,
.menu-item9 .sub-menu9,
.menu-item10 .sub-menu10,
.menu-item11 .sub-menu11,
.menu-item12 .sub-menu12,
.menu-item13 .sub-menu13,
.menu-item14 .sub-menu14{
	position: absolute;
	background: white;
	list-style: none;
}

.checkbox1,
.checkbox2,
.checkbox3,
.checkbox4,
.checkbox5,
.checkbox6,
.checkbox7,
.checkbox8,
.checkbox9,
.checkbox10,
.checkbox11,
.checkbox12,
.checkbox13,
.checkbox14,
.checkbox15,
.checkbox16,
.checkbox17,
.checkbox18,
.checkbox19,
.checkbox20,
.checkbox21,
.checkbox22,
.checkbox23,
.checkbox24,
.checkbox25,
.checkbox26,
.checkbox27,
.checkbox28,
.checkbox29,
.checkbox30,
.checkbox31{
	/*display:inline-flex;*/;
	display: flex;
	align-items: center;
	cursor: pointer;
}



.checkbox__input1,
.checkbox__input2,
.checkbox__input3,
.checkbox__input4,
.checkbox__input5,
.checkbox__input6,
.checkbox__input7,
.checkbox__input8,
.checkbox__input9,
.checkbox__input10,
.checkbox__input11,
.checkbox__input12,
.checkbox__input13,
.checkbox__input14,
.checkbox__input15,
.checkbox__input16,
.checkbox__input17,
.checkbox__input18,
.checkbox__input19,
.checkbox__input20,
.checkbox__input21,
.checkbox__input22,
.checkbox__input23,
.checkbox__input24,
.checkbox__input25,
.checkbox__input26,
.checkbox__input27,
.checkbox__input28,
.checkbox__input29,
.checkbox__input30,
.checkbox__input31{
	display: none;
}

.checkbox__box1,
.checkbox__box2,
.checkbox__box3,
.checkbox__box4,
.checkbox__box5,
.checkbox__box6,
.checkbox__box7,
.checkbox__box8,
.checkbox__box9,
.checkbox__box10,
.checkbox__box11,
.checkbox__box12,
.checkbox__box13,
.checkbox__box14,
.checkbox__box15,
.checkbox__box16,
.checkbox__box17,
.checkbox__box18,
.checkbox__box19,
.checkbox__box20,
.checkbox__box21,
.checkbox__box22,
.checkbox__box23,
.checkbox__box24,
.checkbox__box25,
.checkbox__box26,
.checkbox__box27,
.checkbox__box28,
.checkbox__box29,
.checkbox__box30,
.checkbox__box31{
	width:1.25em;
	height: 1.25em;
	border:2px solid #cccccc;
	border-radius: 3px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-right:5px;
	flex-shrink: 0;
}

.checkbox__box1::after,
.checkbox__box2::after,
.checkbox__box3::after,
.checkbox__box4::after,
.checkbox__box5::after,
.checkbox__box6::after,
.checkbox__box7::after,
.checkbox__box8::after,
.checkbox__box9::after,
.checkbox__box10::after,
.checkbox__box11::after,
.checkbox__box12::after,
.checkbox__box13::after,
.checkbox__box14::after,
.checkbox__box15::after,
.checkbox__box16::after,
.checkbox__box17::after,
.checkbox__box18::after,
.checkbox__box19::after,
.checkbox__box20::after,
.checkbox__box21::after,
.checkbox__box22::after,
.checkbox__box23::after,
.checkbox__box24::after,
.checkbox__box25::after,
.checkbox__box26::after,
.checkbox__box27::after,
.checkbox__box28::after,
.checkbox__box29::after,
.checkbox__box30::after,
.checkbox__box31::after{
	content: '\2714';
	color:white;
}

.checkbox__input1:checked + .checkbox__box1,
.checkbox__input2:checked + .checkbox__box2,
.checkbox__input3:checked + .checkbox__box3,
.checkbox__input4:checked + .checkbox__box4,
.checkbox__input5:checked + .checkbox__box5,
.checkbox__input6:checked + .checkbox__box6,
.checkbox__input7:checked + .checkbox__box7,
.checkbox__input8:checked + .checkbox__box8,
.checkbox__input9:checked + .checkbox__box9,
.checkbox__input10:checked + .checkbox__box10,
.checkbox__input11:checked + .checkbox__box11,
.checkbox__input12:checked + .checkbox__box12,
.checkbox__input13:checked + .checkbox__box13,
.checkbox__input14:checked + .checkbox__box14,
.checkbox__input15:checked + .checkbox__box15,
.checkbox__input16:checked + .checkbox__box16,
.checkbox__input17:checked + .checkbox__box17,
.checkbox__input18:checked + .checkbox__box18,
.checkbox__input19:checked + .checkbox__box19,
.checkbox__input20:checked + .checkbox__box20,
.checkbox__input21:checked + .checkbox__box21,
.checkbox__input22:checked + .checkbox__box22,
.checkbox__input23:checked + .checkbox__box23,
.checkbox__input24:checked + .checkbox__box24,
.checkbox__input25:checked + .checkbox__box25,
.checkbox__input26:checked + .checkbox__box26,
.checkbox__input27:checked + .checkbox__box27,
.checkbox__input28:checked + .checkbox__box28,
.checkbox__input29:checked + .checkbox__box29,
.checkbox__input30:checked + .checkbox__box30,
.checkbox__input31:checked + .checkbox__box31{
	background: black;
	border-color: black;
}

/*.sub-item2:hover a{
	opacity: 0.5;
}*/


/*changes to the actual images and their description*/
.image1{
	position: absolute;
	height: 625px;
	width: 415px;
	left: 340px;
	top:300px;
	z-index: -5;
}

.image2{
	position: absolute;
	height: 625px;
	width: 415px;
	left: 850px;
	top:300px;
	z-index: -5;
}

.image3{
	position: absolute;
	height: 625px;
	width: 350px;
	left: 1370px;
	top:300px;
	z-index: -5;
}

.image4-5{
	position: absolute;
	height: 625px;
	width: 415px;
	left: 340px;
	top:1000px;
	z-index: -5;
}

.img5,
.img7,
.img8{
	opacity: 0;
}

.description01{
	position: absolute;
	height: 45px;
	width: 45px;
	left: 0px;
	top:490px;
	transform: translateY(-10px);
	opacity: 0;
	z-index: -5;
}

.description02{
	position: absolute;
	height: 45px;
	width: 45px;
	left: 50px;
	top:490px;
	transform: translateY(-10px);
	opacity: 0;
	z-index: -5;
}

.description001{
	position: absolute;
	height: 45px;
	width: 45px;
	left: 0px;
	top:490px;
	transform: translateY(-10px);
	opacity: 0;
	z-index: -5;
}

.description002{
	position: absolute;
	height: 45px;
	width: 45px;
	left: 50px;
	top:490px;
	transform: translateY(-10px);
	opacity: 0;
	z-index: -5;
}

.description003{
	position: absolute;
	height: 45px;
	width: 45px;
	left: 100px;
	top:490px;
	transform: translateY(-10px);
	opacity: 0;
	z-index: -5;
}

.img4-1,
.img5-1,
.img6-1,
.img7-1,
.img8-1{
	height: 45px;
	width: auto;
	position: absolute;
}

.image4-5:hover .title1,
.image4-5:hover .description2{
	opacity: 0;
}

.image4-5:hover .description3{
	transform: translateY(-25px);
	transition: 0.3s;
}

.image4-5:hover .description{
	transform: translateY(60px);
	transition: 0.3s;
}

.image4-5:hover .description01,
.image4-5:hover .description02{
	transform: translateY(0px);
	opacity: 1;
	transition: 0.3s;
}

.image6-8{
	position: absolute;
	height: 625px;
	width: 415px;
	left: 860px;
	top:1000px;
	z-index: -5;
}

.image6-8:hover .title1,
.image6-8:hover .description2{
	opacity: 0;
}

.image6-8:hover .description3{
	transform: translateY(-25px);
	transition: 0.3s;
}

.image6-8:hover .description{
	transform: translateY(60px);
	transition: 0.3s;
}

.image6-8:hover .description001,
.image6-8:hover .description002,
.image6-8:hover .description003{
	transform: translateY(0px);
	opacity: 1;
	transition: 0.3s;
}

.image9{
	position: absolute;
	height: 625px;
	width: 350px;
	left: 1370px;
	top:1000px;
	z-index: -5;
}

.image1 > a,
.image2 > a,
.image3 > a,
.image4-5 > a,
.image6-8 > a,
.image9 > a{
	color: black;
	text-decoration: none;
	font-family: 'Poppins';
}

.img1,
.img2,
.img3,
.img4,
.img5,
.img6,
.img7,
.img8,
.img9{
	height: 480px;
	width: auto;
	position: absolute;
}

.title1{
	font-size: 18px;
	top:517px;
	position: absolute;
	left: 0px;
    
}

.description{
	font-size: 16px;
	top:490px;
	color:red;
	position: absolute;
	left: 0px;
}

.description2{
	font-size: 16px;
	top:542px;
	opacity: 50%;
	position: absolute;
	left: 0px;
}

.description3{
	font-size: 17px;
	top:600px;
	position: absolute;
	left: 0px;
}




/*changes to the footer of the site*/
footer{
font-family: "Poppins";
position:absolute;
background:black;
width:100%;
top: 1700px;
left:0;
}
footer .content{
max-width:1500px;
margin:auto;
padding:30px 40px 40px 40px;
}
footer .content .link-boxes{
width:100%;
display:flex;
justify-content:space-between;
}
footer .content .link-boxes .box{
width:calc(100% / 5 - 10px);
}
.content .link-boxes .box .link_name{
color:#fff;
font-size:13px;
font-weight:500;
margin-bottom:10px;
position:relative;
}
.content .link-boxes .box li{
margin:6px 0;
list-style:none;
}
.content .link-boxes .box li a{
text-decoration:none;
color:#fff;
font-size:12px;
opacity:0.5;
transition:all 0.3s ease;
}
.content .link-boxes .box li a:hover{
opacity:1;
}
.top2 .media-icons2{
display:flex;
}
.top2 .media-icons2 a{
width:30px;
height:30px;
background:darkgrey;
margin:0 8px;
border-radius:50%;
text-align:center;
line-height:30px;
color:black;
font-size:20px;
text-decoration:none;
transition: all 0.3s ease;
}
.top2 .media-icons2 a:hover{
background:#f2f2f2;
}
footer .bottom-details{
width:100%;
background:black;
}
footer .bottom-details .bottom_text{
max-width:1500px;
margin:auto;
padding:20px 40px;
display:flex;
justify-content:space-between;
}
.bottom-details .bottom_text span,
.bottom-details .bottom_text a{
font-size:12px;
color:#fff;
text-decoration:none;
opacity:0.5;
transition: all 0.3s ease;
}
.bottom-details .bottom_text .copyright_text > a{
	opacity: 1;
	font-size: 13px;
}
.bottom-details .bottom_text a:hover{
opacity:1;
}
.bottom-details .bottom_text a{
margin-right:10px;
}








/*making the middle navigation dropdown menu responsive*/
@media (max-width: 1900px){
	.menu-item .sub-menu,
	.menu-item .sub-menu2,
	.menu-item .sub-menu3,
	.menu-item .sub-menu4,
	.menu-item .sub-menu5,
	.menu-item .sub-menu6{
		left: -585px;
		width: 260%;
	}
}

@media (max-width: 1880px){
	.menu-item .sub-menu,
	.menu-item .sub-menu2,
	.menu-item .sub-menu3,
	.menu-item .sub-menu4,
	.menu-item .sub-menu5,
	.menu-item .sub-menu6{
		left: -581px;
		width: 258%;
	}
}

@media (max-width: 1860px){
    .menu-item .sub-menu,
	.menu-item .sub-menu2,
	.menu-item .sub-menu3,
	.menu-item .sub-menu4,
	.menu-item .sub-menu5,
	.menu-item .sub-menu6{
		left: -574px;
		width: 256%;
	}
}

@media (max-width: 1845px){
	.menu-item .sub-menu,
	.menu-item .sub-menu2,
	.menu-item .sub-menu3,
	.menu-item .sub-menu4,
	.menu-item .sub-menu5,
	.menu-item .sub-menu6{
		left: -568px;
		width: 254%;
	}
}

@media (max-width: 1827px){
	.menu-item .sub-menu,
	.menu-item .sub-menu2,
	.menu-item .sub-menu3,
	.menu-item .sub-menu4,
	.menu-item .sub-menu5,
	.menu-item .sub-menu6{
		left: -554px;
		width: 250%;
	}
}

@media (max-width: 1810px){
	.menu-item .sub-menu,
	.menu-item .sub-menu2,
	.menu-item .sub-menu3,
	.menu-item .sub-menu4,
	.menu-item .sub-menu5,
	.menu-item .sub-menu6{
		left: -558px;
		width: 250%;
	}
}

@media (max-width: 1790px){
	.menu-item .sub-menu,
	.menu-item .sub-menu2,
	.menu-item .sub-menu3,
	.menu-item .sub-menu4,
	.menu-item .sub-menu5,
	.menu-item .sub-menu6{
		left: -552px;
		width: 248%;
	}
}

@media (max-width: 1770px){
	.menu-item .sub-menu,
	.menu-item .sub-menu2,
	.menu-item .sub-menu3,
	.menu-item .sub-menu4,
	.menu-item .sub-menu5,
	.menu-item .sub-menu6{
		left: -546px;
		width: 246%;
	}
}

@media (max-width: 1759px){
	.menu-item .sub-menu,
	.menu-item .sub-menu2,
	.menu-item .sub-menu3,
	.menu-item .sub-menu4,
	.menu-item .sub-menu5,
	.menu-item .sub-menu6{
		left: -522px;
		width: 242%;
	}
}

@media (max-width: 1747px){
	.menu-item .sub-menu,
	.menu-item .sub-menu2,
	.menu-item .sub-menu3,
	.menu-item .sub-menu4,
	.menu-item .sub-menu5,
	.menu-item .sub-menu6{
		left: -522px;
		width: 241%;
	}
}

@media (max-width: 1731px){
	.menu-item .sub-menu,
	.menu-item .sub-menu2,
	.menu-item .sub-menu3,
	.menu-item .sub-menu4,
	.menu-item .sub-menu5,
	.menu-item .sub-menu6{
		left: -510px;
		width: 238%;
	}
}

@media (max-width: 1717px){
	.menu-item .sub-menu,
	.menu-item .sub-menu2,
	.menu-item .sub-menu3,
	.menu-item .sub-menu4,
	.menu-item .sub-menu5,
	.menu-item .sub-menu6{
		left: -505px;
		width: 236%;
	}
}

@media (max-width: 1700px){
	.menu-item .sub-menu,
	.menu-item .sub-menu2,
	.menu-item .sub-menu3,
	.menu-item .sub-menu4,
	.menu-item .sub-menu5,
	.menu-item .sub-menu6{
		left: -500px;
		width: 234%;
	}
}

@media (max-width: 1675px){
	.menu-item .sub-menu,
	.menu-item .sub-menu2,
	.menu-item .sub-menu3,
	.menu-item .sub-menu4,
	.menu-item .sub-menu5,
	.menu-item .sub-menu6{
		left: -480px;
		width: 230%;
	}
}

@media (max-width: 1655px){
	.menu-item .sub-menu,
	.menu-item .sub-menu2,
	.menu-item .sub-menu3,
	.menu-item .sub-menu4,
	.menu-item .sub-menu5,
	.menu-item .sub-menu6{
		left: -475px;
		width: 228%;
	}
}

@media (max-width: 1637px){
	.menu-item .sub-menu,
	.menu-item .sub-menu2,
	.menu-item .sub-menu3,
	.menu-item .sub-menu4,
	.menu-item .sub-menu5,
	.menu-item .sub-menu6{
		left: -455px;
		width: 224%;
	}
}

@media (max-width: 1619px){
	.menu-item .sub-menu,
	.menu-item .sub-menu2,
	.menu-item .sub-menu3,
	.menu-item .sub-menu4,
	.menu-item .sub-menu5,
	.menu-item .sub-menu6{
		left: -450px;
		width: 222%;
	}
}

@media (max-width: 1599px){
	.menu-item .sub-menu,
	.menu-item .sub-menu2,
	.menu-item .sub-menu3,
	.menu-item .sub-menu4,
	.menu-item .sub-menu5,
	.menu-item .sub-menu6{
		left: -440px;
		width: 219%;
	}
}

@media (max-width: 1575px){
	.menu-item .sub-menu,
	.menu-item .sub-menu2,
	.menu-item .sub-menu3,
	.menu-item .sub-menu4,
	.menu-item .sub-menu5,
	.menu-item .sub-menu6{
		left: -430px;
		width: 216%;
	}
}

@media (max-width: 1565px){
	.menu-item .sub-menu,
	.menu-item .sub-menu2,
	.menu-item .sub-menu3,
	.menu-item .sub-menu4,
	.menu-item .sub-menu5,
	.menu-item .sub-menu6{
		left: -415px;
		width: 213%;
	}
}

@media (max-width: 1538px){
	.menu-item .sub-menu,
	.menu-item .sub-menu2,
	.menu-item .sub-menu3,
	.menu-item .sub-menu4,
	.menu-item .sub-menu5,
	.menu-item .sub-menu6{
		left: -408px;
		width: 210%;
	}
}

@media (max-width: 1508px){
	.menu-item .sub-menu,
	.menu-item .sub-menu2,
	.menu-item .sub-menu3,
	.menu-item .sub-menu4,
	.menu-item .sub-menu5,
	.menu-item .sub-menu6{
		left: -400px;
		width: 207%;
	}
}

@media (max-width: 1480px){
	.menu-item .sub-menu,
	.menu-item .sub-menu2,
	.menu-item .sub-menu3,
	.menu-item .sub-menu4,
	.menu-item .sub-menu5,
	.menu-item .sub-menu6{
		left: -385px;
		width: 204%;
	}
}

@media (max-width: 1458px){
	.menu-item .sub-menu,
	.menu-item .sub-menu2,
	.menu-item .sub-menu3,
	.menu-item .sub-menu4,
	.menu-item .sub-menu5,
	.menu-item .sub-menu6{
		left: -375px;
		width: 201%;
	}
}

@media (max-width: 1446px){
	.menu-item .sub-menu,
	.menu-item .sub-menu2,
	.menu-item .sub-menu3,
	.menu-item .sub-menu4,
	.menu-item .sub-menu5,
	.menu-item .sub-menu6{
		left: -420px;
		width: 243%;
	}
}

@media (max-width: 1424px){
	.menu-item .sub-menu,
	.menu-item .sub-menu2,
	.menu-item .sub-menu3,
	.menu-item .sub-menu4,
	.menu-item .sub-menu5,
	.menu-item .sub-menu6{
		left: -430px;
		width: 243%;
	}
}

@media (max-width: 1412px){
	.menu-item .sub-menu,
	.menu-item .sub-menu2,
	.menu-item .sub-menu3,
	.menu-item .sub-menu4,
	.menu-item .sub-menu5,
	.menu-item .sub-menu6{
		left: -405px;
		width: 238%;
	}
}

@media (max-width: 1412px){
	.menu-item .sub-menu,
	.menu-item .sub-menu2,
	.menu-item .sub-menu3,
	.menu-item .sub-menu4,
	.menu-item .sub-menu5,
	.menu-item .sub-menu6{
		left: -410px;
		width: 238%;
	}
}

@media (max-width: 1386px){
	.menu-item .sub-menu,
	.menu-item .sub-menu2,
	.menu-item .sub-menu3,
	.menu-item .sub-menu4,
	.menu-item .sub-menu5,
	.menu-item .sub-menu6{
		left: -395px;
		width: 234%;
	}
}

@media (max-width: 1370px){
	.menu-item .sub-menu,
	.menu-item .sub-menu2,
	.menu-item .sub-menu3,
	.menu-item .sub-menu4,
	.menu-item .sub-menu5,
	.menu-item .sub-menu6{
		left: -380px;
		width: 230%;
	}
}

@media (max-width: 1351px){
	.menu-item .sub-menu,
	.menu-item .sub-menu2,
	.menu-item .sub-menu3,
	.menu-item .sub-menu4,
	.menu-item .sub-menu5,
	.menu-item .sub-menu6{
		left: -375px;
		width: 227%;
	}
}

@media (max-width: 1327px){
	.menu-item .sub-menu,
	.menu-item .sub-menu2,
	.menu-item .sub-menu3,
	.menu-item .sub-menu4,
	.menu-item .sub-menu5,
	.menu-item .sub-menu6{
		left: -363px;
		width: 223%;
	}
}

@media (max-width: 1320px){
	.menu-item .Discount{
		position: fixed;
		opacity:0;
		pointer-events: none;
	}
	.sub-menu,
	.sub-menu2,
	.sub-menu3,
	.sub-menu4{
    gap: 15px;
    }
	.menu-item .sub-menu,
	.menu-item .sub-menu2,
	.menu-item .sub-menu3,
	.menu-item .sub-menu4,
	.menu-item .sub-menu5,
	.menu-item .sub-menu6{
		left: -435px;
		width: 303%;
	}
}

@media (max-width: 1298px){
	.menu-item .sub-menu,
	.menu-item .sub-menu2,
	.menu-item .sub-menu3,
	.menu-item .sub-menu4,
	.menu-item .sub-menu5,
	.menu-item .sub-menu6{
		left: -423px;
		width: 298%;
	}
}

@media (max-width: 1278px){
	.menu-item .sub-menu,
	.menu-item .sub-menu2,
	.menu-item .sub-menu3,
	.menu-item .sub-menu4,
	.menu-item .sub-menu5,
	.menu-item .sub-menu6{
		left: -430px;
		width: 297%;
	}
}

@media (max-width: 1254px){
	.menu-item .sub-menu,
	.menu-item .sub-menu2,
	.menu-item .sub-menu3,
	.menu-item .sub-menu4,
	.menu-item .sub-menu5,
	.menu-item .sub-menu6{
		left: -407px;
		width: 289%;
	}
	.sub-menu,
	.sub-menu2,
	.sub-menu3,
	.sub-menu4{
    gap: 10px;
    }
}

@media (max-width: 1234px){
	.menu-item .sub-menu,
	.menu-item .sub-menu2,
	.menu-item .sub-menu3,
	.menu-item .sub-menu4,
	.menu-item .sub-menu5,
	.menu-item .sub-menu6{
		left: -400px;
		width: 286%;
	}
}

@media (max-width: 1222px){
	.menu-item .sub-menu,
	.menu-item .sub-menu2,
	.menu-item .sub-menu3,
	.menu-item .sub-menu4,
	.menu-item .sub-menu5,
	.menu-item .sub-menu6{
		left: -393px;
		width: 283%;
	}
}

@media (max-width: 1210px){
	.menu-item .sub-menu,
	.menu-item .sub-menu2,
	.menu-item .sub-menu3,
	.menu-item .sub-menu4,
	.menu-item .sub-menu5,
	.menu-item .sub-menu6{
		left: -385px;
		width: 279%;
	}
	.sub-menu,
	.sub-menu2,
	.sub-menu3,
	.sub-menu4{
    gap: 0px;
    }
}
















/*making the actual images, their description and the footer responsive*/
@media (max-width: 1900px){
	footer{
    top: 1670px;
    }
	.img1,
    .img2,
    .img3,
    .img4,
    .img5,
    .img6,
    .img7,
    .img8,
    .img9{
		height: 470px;
	}
	.image4-5,
	.image6-8,
	.image9{
	top:990px;
    }
	.title1{
		top:507px; 
	}
	.description{
	    top:480px;
    }
    .description2{
	    top:532px;
    }
    .description3{
	    top:590px;
    }
    .description01,
    .description02,
    .description001,
    .description002,
    .description003{
	top:480px;
    }
}

@media (max-width: 1885px){
	.image2{
		left: 840px;
	}
	.image3,
	.image9{
		left: 1350px;
	}
	.image6-8{
    	left: 850px;
    }
}

@media (max-width: 1880px){
	footer{
    top: 1655px;
    }
	.img1,
    .img2,
    .img3,
    .img4,
    .img5,
    .img6,
    .img7,
    .img8,
    .img9{
		height: 460px;
	}
	.image4-5,
	.image6-8,
	.image9{
	top:980px;
    }
	.title1{
		top:497px; 
	}
	.description{
	    top:470px;
    }
    .description2{
	    top:522px;
    }
    .description3{
	    top:580px;
    }
    .description01,
    .description02,
    .description001,
    .description002,
    .description003{
	top:470px;
    }
}

@media (max-width: 1860px){
    .image2{
		left: 830px;
	}
	.image3,
	.image9{
		left: 1330px;
	}
	.image6-8{
    	left: 840px;
    }
}

@media (max-width: 1850px){
	footer{
    top: 1640px;
    }
	.img1,
    .img2,
    .img3,
    .img4,
    .img5,
    .img6,
    .img7,
    .img8,
    .img9{
		height: 450px;
	}
	.image4-5,
	.image6-8,
	.image9{
	top:970px;
    }
	.title1{
		top:487px; 
	}
	.description{
	    top:460px;
    }
    .description2{
	    top:512px;
    }
    .description3{
	    top:570px;
    }
    .description01,
    .description02,
    .description001,
    .description002,
    .description003{
	top:460px;
    }
}

@media (max-width: 1825px){
	.image2{
		left: 820px;
	}
	.image3,
	.image9{
		left: 1310px;
	}
	.image6-8{
    	left: 830px;
    }
}

@media (max-width: 1810px){
	footer{
    top: 1625px;
    }
	.img1,
    .img2,
    .img3,
    .img4,
    .img5,
    .img6,
    .img7,
    .img8,
    .img9{
		height: 440px;
	}
	.image4-5,
	.image6-8,
	.image9{
	top:960px;
    }
	.title1{
		top:477px; 
	}
	.description{
	    top:450px;
    }
    .description2{
	    top:502px;
    }
    .description3{
	    top:560px;
    }
    .description01,
    .description02,
    .description001,
    .description002,
    .description003{
	top:450px;
    }
}

@media (max-width: 1795px){
	.image2{
		left: 810px;
	}
	.image3,
	.image9{
		left: 1290px;
	}
	.image6-8{
    	left: 820px;
    }
}

@media (max-width: 1773px){
	footer{
    top: 1610px;
    }
	.img1,
    .img2,
    .img3,
    .img4,
    .img5,
    .img6,
    .img7,
    .img8,
    .img9{
		height: 430px;
	}
	.image4-5,
	.image6-8,
	.image9{
	top:950px;
    }
	.title1{
		top:467px; 
	}
	.description{
	    top:440px;
    }
    .description2{
	    top:492px;
    }
    .description3{
	    top:550px;
    }
    .description01,
    .description02,
    .description001,
    .description002,
    .description003{
	top:440px;
    }
}

@media (max-width: 1765px){
	.image2{
		left: 800px;
	}
	.image3,
	.image9{
		left: 1270px;
	}
	.image6-8{
    	left: 810px;
    }
}

@media (max-width: 1755px){
	footer{
    top: 1595px;
    }
	.img1,
    .img2,
    .img3,
    .img4,
    .img5,
    .img6,
    .img7,
    .img8,
    .img9{
		height: 420px;
	}
	.image4-5,
	.image6-8,
	.image9{
	top:940px;
    }
	.title1{
		top:457px; 
	}
	.description{
	    top:430px;
    }
    .description2{
	    top:482px;
    }
    .description3{
	    top:540px;
    }
    .description01,
    .description02,
    .description001,
    .description002,
    .description003{
	top:430px;
    }
}

@media (max-width: 1735px){
	.image2{
		left: 790px;
	}
	.image3,
	.image9{
		left: 1250px;
	}
	.image6-8{
    	left: 800px;
    }
}

@media (max-width: 1716px){
	footer{
    top: 1580px;
    }
	.img1,
    .img2,
    .img3,
    .img4,
    .img5,
    .img6,
    .img7,
    .img8,
    .img9{
		height: 410px;
	}
	.image4-5,
	.image6-8,
	.image9{
	top:930px;
    }
	.title1{
		top:447px; 
	}
	.description{
	    top:420px;
    }
    .description2{
	    top:472px;
    }
    .description3{
	    top:530px;
    }
    .description01,
    .description02,
    .description001,
    .description002,
    .description003{
	top:420px;
    }
}

@media (max-width: 1717px){
	footer{
    top: 1565px;
    }
	.img1,
    .img2,
    .img3,
    .img4,
    .img5,
    .img6,
    .img7,
    .img8,
    .img9{
		height: 400px;
	}
	.image4-5,
	.image6-8,
	.image9{
	top:920px;
    }
	.title1{
		top:437px; 
	}
	.description{
	    top:410px;
    }
    .description2{
	    top:462px;
    }
    .description3{
	    top:520px;
    }
    .description01,
    .description02,
    .description001,
    .description002,
    .description003{
	top:410px;
    }
}

@media (max-width: 1697px){
	.image2{
		left: 780px;
	}
	.image3,
	.image9{
		left: 1230px;
	}
	.image6-8{
    	left: 790px;
    }
}

@media (max-width: 1670px){
	.image2{
		left: 770px;
	}
	.image3,
	.image9{
		left: 1210px;
	}
	.image6-8{
    	left: 780px;
    }
}

@media (max-width: 1655px){
	footer{
    top: 1550px;
    }
	.img1,
    .img2,
    .img3,
    .img4,
    .img5,
    .img6,
    .img7,
    .img8,
    .img9{
		height: 390px;
	}
	.image4-5,
	.image6-8,
	.image9{
	top:910px;
    }
	.title1{
		top:427px; 
	}
	.description{
	    top:400px;
    }
    .description2{
	    top:452px;
    }
    .description3{
	    top:510px;
    }
    .description01,
    .description02,
    .description001,
    .description002,
    .description003{
	top:400px;
    }
}

@media (max-width: 1639px){
	.image2{
		left: 760px;
	}
	.image3,
	.image9{
		left: 1190px;
	}
	.image6-8{
    	left: 770px;
    }
}

@media (max-width: 1624px){
	footer{
    top: 1535px;
    }
	.img1,
    .img2,
    .img3,
    .img4,
    .img5,
    .img6,
    .img7,
    .img8,
    .img9{
		height: 380px;
	}
	.image4-5,
	.image6-8,
	.image9{
	top:900px;
    }
	.title1{
		top:417px; 
	}
	.description{
	    top:390px;
    }
    .description2{
	    top:442px;
    }
    .description3{
	    top:500px;
    }
    .description01,
    .description02,
    .description001,
    .description002,
    .description003{
	top:390px;
    }
}

@media (max-width: 1608px){
	.image2{
		left: 750px;
	}
	.image3,
	.image9{
		left: 1170px;
	}
	.image6-8{
    	left: 760px;
    }
}

@media (max-width: 1600px){
	.image2{
		width:315px;
	}
	.image2 .description2{
	top:470px;
    }
    .image2 .description3{
	top:530px;
    }
}

@media (max-width: 1592px){
	footer{
    top: 1520px;
    }
	.img1,
    .img2,
    .img3,
    .img4,
    .img5,
    .img6,
    .img7,
    .img8,
    .img9{
		height: 370px;
	}
	.image4-5,
	.image6-8,
	.image9{
	top:890px;
    }
	.title1{
		top:407px; 
	}
	.description{
	    top:380px;
    }
    .description2{
	    top:432px;
    }
    .description3{
	    top:490px;
    }
    .description01,
    .description02,
    .description001,
    .description002,
    .description003{
	top:380px;
    }
    .image2 .description2{
	top:460px;
    }
    .image2 .description3{
	top:520px;
    }
}

@media (max-width: 1586px){
	.image2{
		left: 740px;
	}
	.image3,
	.image9{
		left: 1150px;
	}
	.image6-8{
    	left: 750px;
    }
}

@media (max-width: 1566px){
	footer{
    top: 1505px;
    }
	.img1,
    .img2,
    .img3,
    .img4,
    .img5,
    .img6,
    .img7,
    .img8,
    .img9{
		height: 360px;
	}
	.image4-5,
	.image6-8,
	.image9{
	top:880px;
    }
	.title1{
		top:397px; 
	}
	.description{
	    top:370px;
    }
    .description2{
	    top:422px;
    }
    .description3{
	    top:480px;
    }
    .description01,
    .description02,
    .description001,
    .description002,
    .description003{
	top:370px;
    }
    .image2 .description2{
	top:450px;
    }
    .image2 .description3{
	top:510px;
    }
}

@media (max-width: 1546px){
	footer{
    top: 1490px;
    }
	.img1,
    .img2,
    .img3,
    .img4,
    .img5,
    .img6,
    .img7,
    .img8,
    .img9{
		height: 350px;
	}
	.image4-5,
	.image6-8,
	.image9{
	top:870px;
    }
	.title1{
		top:387px; 
	}
	.description{
	    top:360px;
    }
    .description2{
	    top:412px;
    }
    .description3{
	    top:470px;
    }
    .description01,
    .description02,
    .description001,
    .description002,
    .description003{
	top:360px;
    }
    .image2 .description2{
	top:440px;
    }
    .image2 .description3{
	top:500px;
    }
}

@media (max-width: 1512px){
	.image2{
		left: 720px;
	}
	.image3,
	.image9{
		left: 1100px;
	}
	.image6-8{
    	left: 730px;
    }
}

@media (max-width: 1496px){
	footer{
    top: 1475px;
    }
	.img1,
    .img2,
    .img3,
    .img4,
    .img5,
    .img6,
    .img7,
    .img8,
    .img9{
		height: 340px;
	}
	.image4-5,
	.image6-8,
	.image9{
	top:860px;
    }
	.title1{
		top:377px; 
	}
	.description{
	    top:350px;
    }
    .description2{
	    top:402px;
    }
    .description3{
	    top:460px;
    }
    .description01,
    .description02,
    .description001,
    .description002,
    .description003{
	top:350px;
    }
    .image2 .description2{
	top:430px;
    }
    .image2 .description3{
	top:490px;
    }
}

@media (max-width: 1480px){
	.image2{
		left: 710px;
	}
	.image3,
	.image9{
		left: 1080px;
	}
	.image6-8{
    	left: 720px;
    }
}

@media (max-width: 1464px){
	footer{
    top: 1460px;
    }
	.img1,
    .img2,
    .img3,
    .img4,
    .img5,
    .img6,
    .img7,
    .img8,
    .img9{
		height: 330px;
	}
	.image4-5,
	.image6-8,
	.image9{
	top:850px;
    }
	.title1{
		top:367px; 
	}
	.description{
	    top:340px;
    }
    .description2{
	    top:392px;
    }
    .description3{
	    top:450px;
    }
    .description01,
    .description02,
    .description001,
    .description002,
    .description003{
	top:340px;
    }
    .image3,
    .image9{
    	width: 300px;
    }
    .image2 .description2,
    .image3 .description2{
	top:420px;
    }
    .image2 .description3,
    .image3 .description3{
	top:480px;
    }
}

@media (max-width: 1446px){
	.menu-item .Collections{
		position: fixed;
		opacity:0;
		pointer-events: none;
	}
	.image2{
		left: 700px;
	}
	.image3,
	.image9{
		left: 1060px;
	}
	.image6-8{
    	left: 710px;
    }
}

@media (max-width: 1435px){
	footer{
    top: 1445px;
    }
	.img1,
    .img2,
    .img3,
    .img4,
    .img5,
    .img6,
    .img7,
    .img8,
    .img9{
		height: 320px;
	}
	.image4-5,
	.image6-8,
	.image9{
	top:840px;
    }
	.title1{
		top:357px; 
	}
	.description{
	    top:330px;
    }
    .description2{
	    top:382px;
    }
    .description3{
	    top:440px;
    }
    .description01,
    .description02,
    .description001,
    .description002,
    .description003{
	top:330px;
    }
    .image2 .description2,
    .image3 .description2{
	top:410px;
    }
    .image2 .description3,
    .image3 .description3{
	top:470px;
    }
}

@media (max-width: 1420px){
	.image2{
		left: 690px;
	}
	.image3,
	.image9{
		left: 1040px;
	}
	.image6-8{
    	left: 700px;
    }
}

@media (max-width: 1405px){
	footer{
    top: 1430px;
    }
	.img1,
    .img2,
    .img3,
    .img4,
    .img5,
    .img6,
    .img7,
    .img8,
    .img9{
		height: 310px;
	}
	.image4-5,
	.image6-8,
	.image9{
	top:830px;
    }
	.title1{
		top:347px; 
	}
	.description{
	    top:320px;
    }
    .description2{
	    top:372px;
    }
    .description3{
	    top:430px;
    }
    .description01,
    .description02,
    .description001,
    .description002,
    .description003{
	top:320px;
    }
    .image2 .description2,
    .image3 .description2{
	top:400px;
    }
    .image2 .description3,
    .image3 .description3{
	top:460px;
    }
}

@media (max-width: 1390px){
	.image2{
		left: 680px;
	}
	.image3,
	.image9{
		left: 1020px;
	}
	.image6-8{
    	left: 690px;
    }
}

@media (max-width: 1375px){
	footer{
    top: 1415px;
    }
	.img1,
    .img2,
    .img3,
    .img4,
    .img5,
    .img6,
    .img7,
    .img8,
    .img9{
		height: 300px;
	}
	.image4-5,
	.image6-8,
	.image9{
	top:820px;
    }
	.title1{
		top:337px; 
	}
	.description{
	    top:310px;
    }
    .description2{
	    top:362px;
    }
    .description3{
	    top:420px;
    }
    .description01,
    .description02,
    .description001,
    .description002,
    .description003{
	top:310px;
    }
    .image2 .description2,
    .image3 .description2{
	top:390px;
    }
    .image2 .description3,
    .image3 .description3{
	top:450px;
    }
}

@media (max-width: 1371px){
	.image2{
		left: 670px;
	}
	.image3,
	.image9{
		left: 1000px;
	}
	.image6-8{
    	left: 680px;
    }
}

@media (max-width: 1352px){
	footer{
    top: 1400px;
    }
	.img1,
    .img2,
    .img3,
    .img4,
    .img5,
    .img6,
    .img7,
    .img8,
    .img9{
		height: 290px;
	}
	.image4-5,
	.image6-8,
	.image9{
	top:810px;
    }
	.title1{
		top:327px; 
	}
	.description{
	    top:300px;
    }
    .description2{
	    top:352px;
    }
    .description3{
	    top:410px;
    }
    .description01,
    .description02,
    .description001,
    .description002,
    .description003{
	top:300px;
    }
    .image1{
    	width: 250px;
    }
    .image1 .description2,
    .image2 .description2,
    .image3 .description2{
	top:380px;
    }
    .image1 .description3,
    .image2 .description3,
    .image3 .description3{
	top:440px;
    }
}

@media (max-width: 1335px){
	.image2{
		left: 660px;
	}
	.image3,
	.image9{
		left: 980px;
	}
	.image6-8{
    	left: 670px;
    }
}

@media (max-width: 1320px){
	footer{
    top: 1385px;
    }
	.img1,
    .img2,
    .img3,
    .img4,
    .img5,
    .img6,
    .img7,
    .img8,
    .img9{
		height: 280px;
	}
	.image4-5,
	.image6-8,
	.image9{
	top:800px;
    }
	.title1{
		top:317px; 
	}
	.description{
	    top:290px;
    }
    .description2{
	    top:342px;
    }
    .description3{
	    top:400px;
    }
    .description01,
    .description02,
    .description001,
    .description002,
    .description003{
	top:290px;
    }
    .image1 .description2,
    .image2 .description2,
    .image3 .description2{
	top:370px;
    }
    .image1 .description3,
    .image2 .description3,
    .image3 .description3{
	top:430px;
    }
}

@media (max-width: 1305px){
	.image2{
		left: 650px;
	}
	.image3,
	.image9{
		left: 960px;
	}
	.image6-8{
    	left: 660px;
    }
}

@media (max-width: 1285px){
	footer{
    top: 1370px;
    }
	.img1,
    .img2,
    .img3,
    .img4,
    .img5,
    .img6,
    .img7,
    .img8,
    .img9{
		height: 270px;
	}
	.image4-5,
	.image6-8,
	.image9{
	top:790px;
    }
	.title1{
		top:307px; 
	}
	.description{
	    top:280px;
    }
    .description2{
	    top:332px;
    }
    .description3{
	    top:390px;
    }
    .image3,
    .image9{
    	width: 250px;
    }
    .description01,
    .description02,
    .description001,
    .description002,
    .description003{
	top:280px;
    }
    .image1 .description2,
    .image2 .description2,
    .image3 .description2{
	top:360px;
    }
    .image1 .description3,
    .image2 .description3,
    .image3 .description3{
	top:420px;
    }
}

@media (max-width: 1270px){
	.image2{
		left: 640px;
	}
	.image3,
	.image9{
		left: 940px;
	}
	.image6-8{
    	left: 650px;
    }
}

@media (max-width: 1255px){
	footer{
    top: 1355px;
    }
	.img1,
    .img2,
    .img3,
    .img4,
    .img5,
    .img6,
    .img7,
    .img8,
    .img9{
		height: 260px;
	}
	.image4-5,
	.image6-8,
	.image9{
	top:780px;
    }
	.title1{
		top:297px; 
	}
	.description{
	    top:270px;
    }
    .description2{
	    top:322px;
    }
    .description3{
	    top:380px;
    }
    .image3,
    .image9{
    	width: 240px;
    }
    .description01,
    .description02,
    .description001,
    .description002,
    .description003{
	top:270px;
    }
    .image1 .description2,
    .image2 .description2,
    .image3 .description2{
	top:350px;
    }
    .image1 .description3,
    .image2 .description3,
    .image3 .description3{
	top:410px;
    }
}

@media (max-width: 1240px){
	.image2{
		left: 630px;
	}
	.image3,
	.image9{
		left: 920px;
	}
	.image6-8{
    	left: 640px;
    }
}

@media (max-width: 1221px){
	footer{
    top: 1340px;
    }
	.img1,
    .img2,
    .img3,
    .img4,
    .img5,
    .img6,
    .img7,
    .img8,
    .img9{
		height: 250px;
	}
	.image4-5,
	.image6-8,
	.image9{
	top:770px;
    }
	.title1{
		top:287px; 
	}
	.description{
	    top:260px;
    }
    .description2{
	    top:312px;
    }
    .description3{
	    top:370px;
    }
    .image3,
    .image9{
    	width: 230px;
    }
    .image2{
    	width: 230px;
    }
    .description01,
    .description02,
    .description001,
    .description002,
    .description003{
	top:260px;
    }
    .image1 .description2,
    .image2 .description2,
    .image3 .description2{
	top:340px;
    }
    .image1 .description3,
    .image2 .description3,
    .image3 .description3{
	top:400px;
    }
}

@media (max-width: 1210px){
	.image2{
		left: 620px;
	}
	.image3,
	.image9{
		left: 900px;
	}
	.image6-8{
    	left: 630px;
    }
}









/*the scrollbar styling is not supported in css*/

/*the unfinished slider for the bottom navbar*/
/* (A) OUTER CONTAINER */
/*.hwrap {*/
  /* (A1) DIMENSIONS */
 /* width: 20%;
  height: 50px; *//* OPTIONAL */

  /* (A2) COSMETICS */
  /*background: #f2f2f2;
  z-index: 999;
  overflow: hidden;*/ /* HIDE SCROLLBARS */
  /*position: absolute;
  padding: 20px 0px;
  background: #f2f2f2;
  font-family: "Poppins";
  margin-top: 125px;
  margin-left: 800px;
  border-bottom: 1px solid #e0e0e0;
}*/

/* (B) MIDDLE CONTAINER - FLEX LAYOUT */
/*.hmove {
  display: flex;
  position: relative;
  top: 0; right: 0;
}*/

/* (C) SLIDES - FORCE INTO ONE LONG HORIZONTAL ROW */
/*.hslide {
  width: 100%;
  flex-shrink: 0;
  box-sizing: border-box;
}*/

/* (D) SLIDE ANIMATION */
/*@keyframes slideh {*/
  /* (D0) THE IDEA - USE KEYFRAMES TO SHIFT SLIDES *
  0% { right: 0; }
  33% { right: 100%; }
  66% { right: 200%; }
  100% { right: 0; }
 
  /* (D1) BUT THE ABOVE WILL SHIFT NON-STOP */
  /* SO WE ADD PAUSES BETWEEN EACH SLIDE */
  /*0% { right: 0; }
  30% { right: 0; }
  33% { right: 100%; }
  63% { right: 100%; }
  66% { right: 200%; }
  97% { right: 200%; }
  100% { right: 0; }
}
.hmove { animation: slideh linear 10s infinite; }
.hmove:hover { animation-play-state: paused; }*/